<script setup>

import useAssetCategoryStore from '@/store/modules/assetCategory'
import {listAll} from "@/api/asset/assetCategory.js";
import treeUtils from '@/utils/tree.js'

const props = defineProps({
  /**当前双向数据绑定的值 */
  value: {
    type: [String, Number],
    default: ''
  },
});

const emit = defineEmits(['update:value']);

const assetCategoryStore = useAssetCategoryStore()
const treeData = ref(assetCategoryStore.getTreeData());

if (!treeData.value.length) {
  listAll().then((response)=>{
    response = response.map(item=> {
      return {
        id: item.id,
        value: item.id,
        label: item.name,
        parentId: item.parentId
      }
    });
    let data = treeUtils.handleTree(response);
    assetCategoryStore.setTreeData(data)
    treeData.value = assetCategoryStore.getTreeData();
  })
}

const valueId = computed({
  get: () => props.value,
  set: (val) => {
    emit('update:value', val)
  }
});

function onChange(item) {
  emit('update:name', item.name);
}

</script>

<template>
  <el-tree-select
      v-model="valueId"
      :data="treeData"
      check-strictly
      :render-after-expand="false"
      @change="onChange"
      style="width: 100%"
  />
</template>

<style scoped lang="scss">

</style>